<template>
  <!-- 自定义导航栏 -->
  <CustomNavbar></CustomNavbar>
  <!-- 滚动容器 -->
  <scroll-view
    scroll-y
    class="scroll-view"
    @scrolltolower="onScrolltolower"
    refresher-enabled
    @refresherrefresh="onRefresherrefresh"
    :refresher-triggered="isRefresherTriggered"
  >
    <!-- 广告轮播区域 -->
    <SpringbokSwiper :list="bannerList"></SpringbokSwiper>
    <!-- 分类面板 -->
    <CategoryPanel :list="itemSaleClassList"></CategoryPanel>
    <!-- 热门推荐 -->
    <SubjectPanel :list="subjectList"></SubjectPanel>
    <!-- 猜你喜欢 -->
    <SpringbokGuess ref="guessRef"></SpringbokGuess>
  </scroll-view>
</template>

<script setup lang="ts">
import { onLoad } from '@dcloudio/uni-app'
import { selectDefaultBranch } from '@/services/branch'
import { getHomeBannerAPI } from '@/services/home'
import { listSubject } from '@/services/subject'
import CustomNavbar from './components/CustomNavbar.vue'
import SpringbokSwiper from '@/components/SpringbokSwiper.vue'
import CategoryPanel from './components/CategoryPanel.vue'
import SubjectPanel from './components/SubjectPanel.vue'
import SpringbokGuess from '@/components/SpringbokGuess.vue'
import { ref } from 'vue'
import type { Banner } from '@/types/home'
import type { Subject } from '@/types/subject'
import { listItemSaleClass } from '@/services/itemSaleClass'
import type { ItemSaleClass } from '@/types/itemSaleClass'
import { useBranchStore } from '@/stores'

// 获取banner数据
let bannerList = ref<Banner[]>([])
async function getHomeBannerData() {
  let res = await getHomeBannerAPI()
  bannerList.value = res.data
}

// 获取分类数据
let itemSaleClassList = ref<ItemSaleClass[]>([])
async function getHomeItemSaleClassData() {
  let res = await listItemSaleClass({ showIndex: true, parentId: 0 })
  itemSaleClassList.value = res.data
}

// 获取专题数据
let subjectList = ref<Subject[]>([])
async function getSubjectData() {
  let res = await listSubject()
  subjectList.value = res.data
}

// 获取默认门店
async function getDefaultBranch() {
  const branchStore = useBranchStore()
  let res = await selectDefaultBranch()
  if (!res.data) {
    uni.showToast({ icon: 'none', title: '找不到默认门店' })
    return
  }
  const branch = { sysBranchId: res.data.sysBranchId, branchName: res.data.branchName }
  branchStore.setBranch(branch)
  getHomeBannerData()
  getHomeItemSaleClassData()
  getSubjectData()
}

onLoad(() => {
  getDefaultBranch()
})

let guessRef = ref()
// 滚动到底部时执行函数
function onScrolltolower() {
  guessRef.value.getMore()
}

// 下拉刷新状态
let isRefresherTriggered = ref(false)
// 下拉刷新触发函数
async function onRefresherrefresh() {
  isRefresherTriggered.value = true
  // 重置猜你喜欢分页参数
  guessRef.value.resetData()
  // 同时发送所有请求，提高加载性能
  await Promise.all([
    getHomeBannerData(),
    getHomeItemSaleClassData(),
    getSubjectData(),
    guessRef.value.getMore(),
  ])
  // 关闭刷新动画
  isRefresherTriggered.value = false
}
</script>

<style lang="scss">
page {
  background: #f7f7f7;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.scroll-view {
  flex: 1;
}
</style>
